<template>
	<view class="bg">
		<image :src="info.invite" style="width: 100%;height:100vh;" mode=""></image>
		<view class="invite">
			<view style="margin: 40rpx 0 10rpx;font-size: 32rpx;"></view>
			<view class="jui_fc_zhuse jui_fs34 jui_font_w600" style="margin-bottom: 20rpx;font-size: 36rpx !important;font-weight: bold;color: #f6f1ee !important;">邀请码：{{code}}</view>
			<canvas canvas-id="qrcode" style="width: 200px;height: 200px;margin: 0 auto 50rpx; " />
			<button class="invBtn" @tap="$tool.h5Copy(path)">复制链接</button>
		</view>
	</view>
</template>

<script>
import uQRCode from '@/js_sdk/Sansnn-uQRCode/uqrcode.js'
export default {
	data() {
		return {
			code:'',
			info:{},
			path:''
		};
	},
	onLoad() {
		this.init();
	},
	methods: {
		init(){
			let _token = uni.getStorageSync('token');
			let params ={
				_token: _token, 
			}
			this.$api.my(params).then(res => {
				if(res.ok){
					let invitcodepath = 'https://www.ynbinlishenghuo.com:8080/h5/#/pages/login/register?inviteCode=' + res.data.invitcode;
					this.code = res.data.invitcode;
					this.path = invitcodepath;
					uQRCode.make({
						canvasId: 'qrcode',
						componentInstance: this,
						text: invitcodepath,
						size: 200,
						margin: 10,
						backgroundColor: '#ffffff',
						foregroundColor: '#000000',
						fileType: 'jpg',
						errorCorrectLevel: uQRCode.errorCorrectLevel.H,
						success: res => {
							
						}
					})
				}else{
					
				}
			});
		}
	}
};
</script>

<style lang="scss" scoped>
	.invBtn{
		width: 80%;
		height: 72rpx;
		background-color: #ffaa00;
		border-radius: 36rpx;
		font-size: 30rpx;
		color:#fff;
		line-height: 72rpx;
	}
	page {
		height: 100%;
	}
	.bg {
		position: relative;
		width: 100%;
		height: 100%;
		background:url(https://www.ynbinlishenghuo.com:1803/app/images/com.png) no-repeat center;
		background-size: 100% 100%;
		border-radius: 16rpx;
		box-shadow: 0 0 20px #3168D9;
		position: absolute;
		bottom: 0;
		left: 50%;
		transform: translate(-50%, 0);
		text-align: center;
	}
	.invite {
		width: 584rpx;
		height: 996rpx;
		position: absolute;
		bottom:0;
		left: 50%;
		transform: translate(-50%, 0);
		text-align: center;
		image {
			height: 300rpx;
			width: 300rpx;
			margin-top: 180rpx;
		}
	}
</style>
